import React from 'react';
import {Router, Route, Link} from 'react-router';

import utils from '../js/utils';

class User extends React.Component {
  constructor () {
    super();
    this.state = {
      weixinShare: utils.weixinShare,
      app: {},
      user: {},
      appid: "5c91f01872d2dd151861d180",
      yaoqingma: []
    }
  }

  componentDidMount () {
    let appid = this.state.appid;
    let openid = this.props.params.openid;

    let _this = this;
    $('meta[content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"]').remove();
    $('head').append('<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />');
    if (openid) {

      utils.checkBrowser(appid, openid)

      utils.get_access_token(appid, function (access_token, app) {

        if (!app) {
          return
        }

        var sharetitle = app.app_name;
        var sharelink = 'https://shop.ke.juzizhi.cn/#/' + appid + "/undefined";
        var sharedesc = app.app_name;
        var shareimg = "https://ke.juzizhi.cn" + app.app_litpic;
        _this.state.weixinShare(sharetitle,sharelink,sharedesc,shareimg);

        _this.setState({
          app: app
        })

        utils.common_post("/get_app_user", {appid, openid, access_token}, function (res) {
          console.log(res);
          if (parseInt(res.code, 10) == 200) {
            _this.setState({
              user: res.user
            })
          }
        })

        utils.common_post("/get_user_yaoqingma_list", {appid, openid, access_token}, function (res) {
          console.log(res);
          if (parseInt(res.code, 10) == 200) {
            _this.setState({
              yaoqingma: res.yaoqingma
            })
          }
        })

        setTimeout(function () {
          utils.Tongji(appid, access_token);
        }, 1000)
      })
    }
  }

  render () {
    let user = this.state.user;
    return (
      <div>
        <div className="user-header">
          <img src={user.headimgurl} />
          <div>
            <img src="/static/icon/login_weixin.png" />
            <span>{user.nickname}</span>
          </div>
        </div>
        <div className="divider"></div>
        <div className="user-yaoqignma-list">
          <div>
            <table className="bamboo-table" cellSpacing="0">
              <thead>
                <tr>
                  <th>年级</th>
                  <th>邀请码</th>
                  <th>是否使用</th>
                </tr>
              </thead>
              <tbody>
                {
                  this.state.yaoqingma.map(function (item, idx) {
                    return <tr key={idx}>
                      <td>{item.typename}</td>
                      <td>{item.code}</td>
                      <td>{item.is_used == 0 ? "否" : "是"}</td>
                    </tr>
                  })
                }
              </tbody>
            </table>
          </div>
        </div>
      </div>
    )
  }
}

export default User;
